<template>
	<view>
		<FullscreenLoading :loading="loading"></FullscreenLoading>
		<view class="muu-classroom" :class="[config.style]">
			<view class="main-section tabbar-bottom" >
				<view class="item" v-for="(item,index) in pageData.data" :key="index">
					<view v-if="item.type==='announce'">
						<Announce title="公告组件" type="announce" :params="item.data" :config="config" />
					</view>
					<view v-if="item.type==='category'">
						<Category title="分类组件" type="category" :params="item.data" :config="config" />
					</view>
					<view v-if="item.type==='category_nav'">
						<CategoryNav title="图文导航组件" type="category_nav" :params="item.data" :config="config" />
					</view>
					<view v-if="item.type==='search'">
						<Search title="搜索组件" type="search" :config="config" />
					</view>
					<view v-if="item.type==='slideshow'">
						<SlideShow title="轮播组件" type="slideshow" :slideshowStyle="Number(item.style)" :params="item.data" :config="config" />
					</view>
					<view v-if="item.type==='single_img'">
						<SingleImg title="单图广告组件" type="single_img" :singleImgStyle="Number(item.style)" :params="item.data" :config="config"/>
					</view>
					<view v-if="item.type==='weixin'">
						<Weixin title="关注公众号组件" type="weixin" :thisStyle="Number(item.style)" :config="config" />
					</view>
					<view v-if="item.type==='goods_list'">
						<ScoreshopGoodsList title="积分商城商品列表组件" type="minishop_goods_list" :params="item.data" :config="config" />
					</view>
					<view v-if="item.type==='activity_list'">
						<ActivityList title="线下活动列表组件" type="activity_list" :params="item.data" :config="config" />
					</view>
					<view v-if="item.type==='minishop_goods_list'">
						<MinishopGoodsList title="云小店商品列表组件" type="scoreshop_goods_list" :params="item.data" :config="config" />
					</view>
				</view>
				<template v-if="pageData">
					<CopyRight />
				</template>
			</view>
			<tabBar v-if="!loading" />
		</view>
	</view>
	
</template>

<script>
	import { mapState,mapMutations,mapActions } from 'vuex'
	//全屏加载中
	import FullscreenLoading from '../../../components/muu-fullscreen-loading/muu-fullscreen-loading.vue'
	//DIY组件 按首字母顺序排列
	import Announce from '../../diys/Announce/Announce.vue' //公告组件
	import Category from '../../diys/Category/Category.vue' //分类组件
	import CategoryNav from '../../diys/CategoryNav/CategoryNav.vue' //图文导航组件
	import MinishopGoodsList from '../../diys/MinishopGoodsList/MinishopGoodsList.vue' //云小店商品列表组件
	import ScoreshopGoodsList from '../../diys/ScoreshopGoodsList/ScoreshopGoodsList.vue' //积分商城商品列表组件
	import Search from '../../diys/Search/Search.vue' //搜索组件
	import SlideShow from '../../diys/SlideShow/SlideShow.vue' //轮播组件
	import SingleImg from '../../diys/SingleImg/SingleImg.vue' //单图广告组件
	import Weixin from '../../diys/Weixin/Weixin.vue' //关注公众号组件
	import CopyRight from '../common/copyRight.vue' //自定义版权
	import TabBar from "../common/tabBar.vue" //底部导航

	export default {

		components: {
			FullscreenLoading,
			Announce,
			Category,
			CategoryNav,
			MinishopGoodsList,
			ScoreshopGoodsList,
			Search,
			SlideShow,
			SingleImg,
			Weixin,
			CopyRight,
			TabBar,
		},
		data() {
			return {
				loading: true,
				urlParams: {}, //url传递过来的参数
				pageData : {}, //首页数据
			}
		},
		
		onPageScroll(e) {
			
		},
		onLoad(option) {
			//获取url参数
			this.getUrlParam()
			Promise.all([this.setConfigAsync(),this.getPageData()]).then(res => {
				console.log(res)
				this.initPage(res[0])
				//加载完成
				this.loading = false
			})
		},
		created() {
			this.initPage()
		},
		watch: {
		    "$store.state.config"(newval, olval) {
		      console.log('监听',newval);
			  this.initPage(this.config)
		    },
		},
		computed: {
			...mapState(['config'])
		},
		methods: {
			initPage(config) {
				//设置原生导航栏
				this.setNavigation(this.config.style);
				//设置原生导航栏标题
				uni.setNavigationBarTitle({
				　　title:this.config.title
				})
				// H5端执行
				//#ifdef H5
				let url = window.location.href
				let shareData = {
					title : this.pageDate.title,
					desc : this.pageDate.desc,
					img: config.share.icon
				}
				this.wechat.share(shareData,url);
				//#endif
			},

			//获取url参数
			getUrlParam: function(){
				// #ifdef MP-WEIXIN
				//console.log('小程序端执行')
				let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
				let curRoute = routes[routes.length - 1].route //获取当前页面路由
				let curParam = routes[routes.length - 1].options; //获取路由参数
				// #endif
			
				// #ifdef H5
				let curParam = this.$route.query;
				// #endif
				this.urlParams = curParam
				//获取页面数据
				this.getPageData()
			},
			/**
			 * 获取页面数据
			 */
			getPageData: function(){
				let that = this
				let params = this.urlParams
				let data = {}
					data.id = this.urlParams.id
					if(params.hasOwnProperty("promoter_uid") && params.promoter_uid !== undefined){
						data.promoter_uid = params.promoter_uid
					}
				//获取自定义页面数据
				let url = '';
					//#ifdef MP-WEIXIN
					url = 'entry/wxapp/page'
					//#endif
					//#ifdef H5
					url = 'entry/site/page'
					//#endif
				this.util.request({
					url : url,
					data : data,
					success: function (res) {
						//console.log(res.data.code);
						if (res.data.code == 200) {
							//console.log(res.data)
							that.pageData = res.data.data
							//设置原生导航栏
							that.setNavigation(res.data.data);
							that.loading = false;
						}
					}
				})
			},
			setNavigation: function(data) {
				let that = this
				//更改小程序原生导航栏
				uni.setNavigationBarTitle({
					title: data.title
				})
			}
		},
		
		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage() {
			// 分享(分销)用户ID
			let promoterUid = this.userInfo.memberInfo.uid || 0
			let share = {
				title : this.pageData.title,
				path : '@/muu_classroom/pages/customPage/index?' + 'id=' + this.pageData.id + '&promoter_uid=' + promoterUid,
				desc : this.pageData.description,
				success : function(){
					
				},
			}
			
			return share
		},
		/**
		 * 监听用户点击右上角转发到朋友圈
		 */
		onShareTimeline() {
			
		}
	}
</script>

<style lang="scss">

</style>
